<!--
@文件名： mainBase.vue
@来源：YongPing.Wang|2023/11/12 11:12
@描述：平台
-->
<template>
  <div class="mainBase LG-wh100" id="mainBaseId">
    <platform-layout-one v-if="layoutType === EPlatformLayout.leftRightLayout" />
    <platform-layout-two v-else-if="layoutType === EPlatformLayout.topLeftRightLayout" />
    <!--配置-->
    <config-com />
  </div>
</template>
<script setup lang="ts">
  import PlatformLayoutOne from '@/viewBase/mainModel/layout/platformLayoutOne.vue'
  import PlatformLayoutTwo from '@/viewBase/mainModel/layout/platformLayoutTwo.vue'
  import { layoutInfo } from '@/store/layoutInfo.ts'
  import { onMounted, ref, watchEffect } from 'vue'
  import { EPlatformLayout } from '@/store/types.ts'
  import ConfigCom from '@/viewBase/mainModel/components/configCom.vue'
  import { menuInfo } from '@/store/menuInfo.ts'

  const layoutInfoStore = layoutInfo()
  const menuInfoStore = menuInfo()

  const layoutType = ref<EPlatformLayout>(EPlatformLayout.leftRightLayout)
  // 修改布局
  const changeLayout = (): void => {
    layoutType.value = layoutInfoStore.platformLayout
  }
  // 监听修改布局
  watchEffect(changeLayout)

  onMounted(() => {
    void menuInfoStore.getMenu()
  })
</script>
<style scoped lang="scss">
  .mainBase {
    overflow: hidden;
    position: relative;
  }
</style>
